@charset "UTF-8"; 

*, :after, :before {
	box-sizing: none;
	outline: none
}

body, html {
	height: 100%;
	font-family: "Helvetica Neue", Helvetica, Arial, "Hiragino Sans GB",
		"Microsoft YaHei", sans-serif;
	font-size: 14px;
	line-height: 1.42857143
}

body {
	margin: 0;
	zoom: 1
}

a {
	text-decoration: none;
	cursor: pointer
}

a img {
	border: 0
}

.pull-left {
	float: left
}

.pull-right {
	float: right
}

.clearfix {
	clear: both
}

#alert, #alert #alertHide {
	position: absolute;
	right: 0;
	height: 40px
}

#alert {
	left: 0;
	z-index: 7;
	padding: 0 35px 0 10px;
	background-color: #fffadd;
	border-bottom: 1px solid rgba(0, 0, 0, .06);
	top: 60px;
	width: 100%
}

#alert.hide, #pageChat.remove-brand .footer .support-holder {
	display: none
}

#alert #alertInside {
	width: 100%;
	height: 40px;
	overflow: hidden;
	line-height: 40px;
	font-size: 14px;
	text-align: center;
	color: #666458;
	text-overflow: ellipsis;
	white-space: nowrap
}

#alert #alertHide {
	top: 0;
	width: 30px;
	text-align: center;
	cursor: pointer
}

#alert #alertHide .icon-times {
	display: block;
	width: 22px;
	height: 22px;
	margin-top: 9px
}

@
-webkit-keyframes dot { 0%,50%{
	opacity: 0
}

to {
	opacity: 1
}

}
@
keyframes dot { 0%,50%{
	opacity: 0
}

to {
	opacity: 1
}

}
.ios-scrolling {
	-webkit-overflow-scrolling: touch
}

#alertHide .icon-times {
	background-position: 0 -132px
}

.icon-logo-gray {
	display: inline-block;
	width: 20px;
	height: 20px;
	background-position: 0 -264px
}

#autocomplete {
	position: absolute;
	bottom: 1em;
	left: 1em;
	right: 1.5em;
	background: #fff;
	box-shadow: 0 0 20px rgba(0, 0, 0, .18);
	will-change: transform, opacity;
	-webkit-animation-name: fadeup;
	animation-name: fadeup;
	-webkit-animation-duration: .15s;
	animation-duration: .15s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-delay: .1s;
	animation-delay: .1s;
	overflow: hidden
}

#autocomplete ul {
	list-style: none;
	padding: 0;
	margin: 0
}

#autocomplete li {
	border-top: 1px solid #eee
}

#autocomplete li a {
	display: block;
	text-decoration: none;
	color: #a5a5a5;
	padding: .85em;
	font-size: 13px;
	word-break: break-all
}

#autocomplete li a:hover, #autocomplete li a[data-current=true] {
	background: #007aff
}

#autocomplete li a:hover, #autocomplete li a:hover em, #autocomplete li a[data-current=true],
	#autocomplete li a[data-current=true] em {
	color: #fff
}

#autocomplete li em {
	font-style: normal;
	text-decoration: underline;
	color: #009de7;
	margin: 0 1px
}

#autocomplete li:first-child {
	border-top: none
}

@
-webkit-keyframes fadeup { 0%{
	opacity: 0;
	-webkit-transform: translate3d(0, 8px, 0);
	transform: translate3d(0, 8px, 0)
}

to {
	opacity: 1;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0)
}

}
@
keyframes fadeup { 0%{
	opacity: 0;
	-webkit-transform: translate3d(0, 8px, 0);
	transform: translate3d(0, 8px, 0)
}

to {
	opacity: 1;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0)
}

}
#pageChat {
	position: relative;
	z-index: 2;
	width: 100%;
	height: 100%;
	overflow: hidden
}

#pageChat.remove-brand .body {
	bottom: 100px
}

#pageChat.remove-brand .footer {
	height: 100px
}

#pageChat.remove-brand #queueingTips, #pageChat.remove-brand #unableService
	{
	bottom: 0
}

#pageChat #evaluationHolder, #pageChat #evaluationMask {
	position: absolute;
	display: none;
	top: 60px;
	left: 0;
	width: 100%
}

#pageChat #evaluationMask {
	right: 0;
	bottom: 0;
	height: auto;
	background-color: rgba(0, 0, 0, .35);
	z-index: 5
}

#pageChat #evaluationHolder {
	z-index: 6;
	background-color: #fff;
	border-bottom: 1px solid #ededed;
	box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .1)
}

#pageChat #evaluationHolder.evaluation-active-0 #evaluation0, #pageChat #evaluationHolder.evaluation-active-1 #evaluation1,
	#pageChat #evaluationHolder.evaluation-active-2 #evaluation2, #pageChat .evaluation-body .evaluation-btn:hover
	{
	background-color: #fafafa;
	border-color: #f0f0f0;
	border-radius: 3px
}

#pageChat #evaluationHolder.evaluation-active-2 #evaluation2>span,
	#pageChat .evaluation-body .evaluation-btn:hover#evaluation2>span {
	color: #00ce7d
}

#pageChat #evaluationHolder.evaluation-active-1 #evaluation1>span,
	#pageChat .evaluation-body .evaluation-btn:hover#evaluation1>span {
	color: #ffb652
}

#pageChat #evaluationHolder.evaluation-active-0 #evaluation0>span,
	#pageChat .evaluation-body .evaluation-btn:hover#evaluation0>span {
	color: #ff5c5e
}

#pageChat .evaluation-header .intro {
	margin: 12px 35px 0;
	text-align: center;
	font-size: 14px;
	color: #666;
	max-height: 6em;
	overflow: auto
}

#pageChat #evaluationHide {
	position: absolute;
	top: 10px;
	right: 10px
}

#pageChat #evaluationHide .icon-times {
	display: block;
	width: 22px;
	height: 22px;
	background-position: 0 -132px
}

#pageChat .evaluation-body {
	margin: 10px 15px 0
}

#pageChat .evaluation-body .evaluation-btn-group {
	width: 210px;
	margin: 0 auto 10px
}

#pageChat .evaluation-body .evaluation-btn-group:after {
	display: block;
	content: '';
	clear: both
}

#pageChat .evaluation-body .evaluation-btn {
	float: left;
	width: 60px;
	height: 70px;
	margin: 0 5px;
	border: 1px solid #fff;
	cursor: pointer
}

#pageChat .evaluation-body .evaluation-btn .icon {
	display: block;
	width: 40px;
	height: 40px;
	margin: 5px auto 0
}

#pageChat .evaluation-body .evaluation-btn .icon-smile {
	background-position: -2px -310px
}

#pageChat .evaluation-body .evaluation-btn .icon-neutral {
	background-position: -2px -354px
}

#pageChat .evaluation-body .evaluation-btn .icon-angry {
	background-position: -2px -398px
}

#pageChat .evaluation-body .evaluation-btn>span {
	display: block;
	margin-top: 5px;
	text-align: center;
	font-size: 12px;
	color: #666
}

#pageChat .evaluation-body .evaluation-reason {
	margin-bottom: 15px
}

#pageChat .evaluation-body .evaluation-reason>label {
	display: block;
	margin-bottom: 4px;
	font-size: 12px;
	color: #999
}

#pageChat .evaluation-body #evaluationContent {
	width: 100%;
	height: 60px;
	padding: 10px;
	overflow-y: auto;
	resize: none;
	border: 1px solid #ededed
}

#pageChat .evaluation-body #evaluationSubmit {
	width: 100%;
	height: 35px;
	line-height: 32px;
	margin-top: 10px;
	font-size: 14px;
	border: 0;
	border-radius: 3px
}

#pageChat .body, #pageChat .header {
	position: absolute;
	right: 0;
	left: 0;
	width: 100%
}

#pageChat .header {
	z-index: 3;
	height: 60px;
	padding: 7px 10px;
	zoom: 1;
	font-size: 16px;
	box-shadow: 0 1px 0 0 rgba(0, 0, 0, .06), 0 2px 0 0 rgba(0, 0, 0, .01);
	top: 0
}

#pageChat .header #loading {
	height: 60px;
	font-size: 14px;
	line-height: 45px
}

#pageChat .header #loading .dot1, #pageChat .header #loading .dot2,
	#pageChat .header #loading .dot3 {
	opacity: 0;
	-webkit-animation: dot 1.3s infinite;
	animation: dot 1.3s infinite;
	-webkit-animation-delay: 0s;
	animation-delay: 0s
}

#pageChat .header #loading .dot2, #pageChat .header #loading .dot3 {
	-webkit-animation-delay: .2s;
	animation-delay: .2s
}

#pageChat .header #loading .dot3 {
	-webkit-animation-delay: .3s;
	animation-delay: .3s
}

#pageChat .header .agent-avatar {
	position: absolute;
	top: 15px;
	left: 10px;
	width: 30px;
	height: 30px;
	border-radius: 15px;
	box-shadow: 0 3px 3px 0 rgba(0, 0, 0, .1)
}

#pageChat .header .agent-info {
	margin-left: 40px
}

#pageChat .header .agent-name, #pageChat .header .agent-signature {
	width: 175px;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap
}

#pageChat .header .agent-name {
	position: relative;
	margin-top: 5px;
	font-size: 13px
}

#pageChat .header .agent-name.without-signature {
	margin-top: 16px
}

#pageChat .header .agent-signature {
	margin-top: 1px;
	font-size: 12px
}

#pageChat .header #agentInputting {
	position: absolute;
	display: none;
	top: 0;
	left: 0;
	width: 160px
}

#pageChat .body .msg-agent .file .content .sub .btn-download>span,
	#pageChat .body .msg-bot .file .content .sub .btn-download>span,
	#pageChat .body .msg-client .file .content .sub .btn-download>span,
	#pageChat .header #btnRing {
	float: left
}

#pageChat .header #btnHideChat {
	float: left;
	line-height: 1
}

#pageChat .footer .feature-holder .feature-btn>i, #pageChat .header .icon-angel-down,
	#pageChat .header .icon-ring-close, #pageChat .header .icon-ring-open {
	display: block;
	width: 22px;
	height: 22px
}

#pageChat .header #btnCallAgent {
	display: none;
	float: left;
	height: 22px;
	line-height: 22px;
	font-size: 12px;
	margin-right: 2px;
	color: #fff;
	filter: alpha(opacity = 80);
	opacity: .8;
	*zoom: 1
}

#pageChat .header #btnCallAgent:hover {
	filter: alpha(opacity = 100);
	opacity: 1
}

#pageChat .body {
	top: 60px;
	bottom: 130px;
	background-color: rgba(252, 252, 252, .96)
}

#pageChat .body #msgWrapper {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	word-wrap: break-word
}

#pageChat .body #msgHolder {
	margin: 14px
}

#pageChat .body #moreHistoryBtn {
	display: block;
	margin-bottom: 10px;
	text-align: center;
	font-size: 12px;
	color: #777;
	cursor: pointer
}

#pageChat .body .msg-box {
	margin-bottom: 20px
}

#pageChat .body .msg-agent, #pageChat .body .msg-bot, #pageChat .body .msg-client
	{
	position: relative;
	width: 100%;
	margin-bottom: 20px
}

#pageChat .body .msg-agent:after, #pageChat .body .msg-bot:after,
	#pageChat .body .msg-client:after {
	display: block;
	clear: both;
	content: ""
}

#pageChat .body .msg-agent .bubble, #pageChat .body .msg-bot .bubble,
	#pageChat .body .msg-client .bubble {
	position: relative;
	border-radius: 3px;
	padding: 8px 12px;
	font-size: 13px;
	line-height: 20px;
	word-wrap: break-word
}

#pageChat .body .msg-agent .bubble .text .emoji, #pageChat .body .msg-bot .bubble .text .emoji,
	#pageChat .body .msg-client .bubble .text .emoji {
	width: 20px;
	height: 20px;
	vertical-align: middle
}

#pageChat .body .msg-agent .bubble .text a, #pageChat .body .msg-bot .bubble .text a,
	#pageChat .body .msg-client .bubble .text a {
	text-decoration: underline
}

#pageChat .body .msg-agent .file .content .sub, #pageChat .body .msg-agent .file .content .title,
	#pageChat .body .msg-agent .photo, #pageChat .body .msg-bot .file .content .sub,
	#pageChat .body .msg-bot .file .content .title, #pageChat .body .msg-bot .photo,
	#pageChat .body .msg-client .file .content .sub, #pageChat .body .msg-client .file .content .title,
	#pageChat .body .msg-client .photo {
	position: relative
}

#pageChat .body .msg-agent .photo img, #pageChat .body .msg-bot .photo img,
	#pageChat .body .msg-client .photo img {
	width: auto;
	max-width: 100%;
	max-height: 280px;
	border-radius: 4px
}

#pageChat .body .msg-agent .file, #pageChat .body .msg-bot .file,
	#pageChat .body .msg-client .file {
	position: relative;
	padding: 8px 12px 8px 64px;
	font-size: 13px;
	line-height: 20px;
	color: #000;
	background-color: #fff;
	border: 1px solid #f0f0f0;
	border-radius: 3px
}

#pageChat .body .msg-agent .file .icon-file, #pageChat .body .msg-bot .file .icon-file,
	#pageChat .body .msg-client .file .icon-file {
	position: absolute;
	top: 8px;
	left: 10px;
	width: 40px;
	height: 40px;
	background-position: 0 -530px
}

#pageChat .body .msg-agent .file .content .title .file-name, #pageChat .body .msg-bot .file .content .title .file-name,
	#pageChat .body .msg-client .file .content .title .file-name {
	display: block;
	padding-right: 56px;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	font-size: 12px;
	color: #333
}

#pageChat .body .msg-agent .file .content .title .file-size, #pageChat .body .msg-bot .file .content .title .file-size,
	#pageChat .body .msg-client .file .content .title .file-size {
	position: absolute;
	top: 0;
	right: 0;
	font-size: 12px;
	color: #777
}

#pageChat .body .msg-agent .file .content .sub .file-state, #pageChat .body .msg-bot .file .content .sub .file-state,
	#pageChat .body .msg-client .file .content .sub .file-state {
	display: block;
	padding-right: 56px;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	font-size: 12px;
	color: #777
}

#pageChat .body .msg-agent .file .content .sub .progress-holder,
	#pageChat .body .msg-bot .file .content .sub .progress-holder,
	#pageChat .body .msg-client .file .content .sub .progress-holder {
	display: block;
	position: relative;
	padding: 9px 26px 2px 0
}

#pageChat .body .msg-agent .file .content .sub .progress-holder .progress-bg,
	#pageChat .body .msg-bot .file .content .sub .progress-holder .progress-bg,
	#pageChat .body .msg-client .file .content .sub .progress-holder .progress-bg
	{
	display: block;
	height: 2px;
	overflow: hidden;
	background-color: #f4f4f4;
	border-radius: 1px
}

#pageChat .body .msg-agent .file .content .sub .progress-holder .progress-bar,
	#pageChat .body .msg-bot .file .content .sub .progress-holder .progress-bar,
	#pageChat .body .msg-client .file .content .sub .progress-holder .progress-bar
	{
	display: block;
	width: 0;
	height: 2px;
	background-color: #4ca0ff;
	border-radius: 1px
}

#pageChat .body .msg-agent .file .content .sub .progress-holder .upload-speed,
	#pageChat .body .msg-bot .file .content .sub .progress-holder .upload-speed,
	#pageChat .body .msg-client .file .content .sub .progress-holder .upload-speed
	{
	position: absolute;
	bottom: -10px;
	left: 0;
	color: #777;
	font-size: 12px
}

#pageChat .body .msg-agent .file .content .sub .btn-cancel-upload,
	#pageChat .body .msg-agent .file .content .sub .btn-download, #pageChat .body .msg-bot .file .content .sub .btn-cancel-upload,
	#pageChat .body .msg-bot .file .content .sub .btn-download, #pageChat .body .msg-client .file .content .sub .btn-cancel-upload,
	#pageChat .body .msg-client .file .content .sub .btn-download {
	position: absolute;
	top: 0;
	right: 0;
	font-size: 12px;
	color: #4ca0ff
}

#pageChat .body .msg-agent .file .content .sub .btn-download .icon-download,
	#pageChat .body .msg-bot .file .content .sub .btn-download .icon-download,
	#pageChat .body .msg-client .file .content .sub .btn-download .icon-download
	{
	float: left;
	display: block;
	width: 20px;
	height: 20px;
	margin-right: 1px;
	background-position: 0 -463px
}

#pageChat .body .msg-agent .file .content .sub .btn-cancel-upload:active .icon-cancel-upload,
	#pageChat .body .msg-agent .file .content .sub .btn-cancel-upload:hover .icon-cancel-upload,
	#pageChat .body .msg-bot .file .content .sub .btn-cancel-upload:active .icon-cancel-upload,
	#pageChat .body .msg-bot .file .content .sub .btn-cancel-upload:hover .icon-cancel-upload,
	#pageChat .body .msg-client .file .content .sub .btn-cancel-upload:active .icon-cancel-upload,
	#pageChat .body .msg-client .file .content .sub .btn-cancel-upload:hover .icon-cancel-upload
	{
	background-position: -22px -507px
}

#pageChat .body .msg-agent .file .content .sub .btn-cancel-upload .icon-cancel-upload,
	#pageChat .body .msg-bot .file .content .sub .btn-cancel-upload .icon-cancel-upload,
	#pageChat .body .msg-client .file .content .sub .btn-cancel-upload .icon-cancel-upload
	{
	float: left;
	display: block;
	width: 20px;
	height: 20px;
	margin-right: 1px;
	background-position: 0 -507px
}

#pageChat .body .msg-agent .arrow, #pageChat .body .msg-agent .arrow-bg,
	#pageChat .body .msg-bot .arrow, #pageChat .body .msg-bot .arrow-bg,
	#pageChat .body .msg-client .arrow, #pageChat .body .msg-client .arrow-bg
	{
	position: absolute;
	display: block;
	width: 0;
	height: 0;
	font-size: 0
}

#pageChat .body .msg-client .date {
	margin-bottom: 2px;
	font-size: 12px;
	line-height: 14px;
	color: #b2b2b2;
	width: 100%;
	text-align: right
}

#pageChat .body .msg-client .bubble, #pageChat .body .msg-client .photo
	{
	float: right;
	width: auto;
	max-width: 100%;
	margin-left: 35px
}

#pageChat .body .msg-client .status {
	position: absolute;
	left: -25px;
	top: 8px
}

#pageChat .body .msg-client .status-fail {
	width: 22px;
	height: 22px;
	background-position: 0 -241px
}

#pageChat .body .msg-client .arrow {
	top: 14px;
	right: -6px;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent
}

#pageChat .body .msg-client .file {
	width: auto;
	max-width: 100%;
	margin-left: 35px
}

#pageChat .body .msg-client .file .arrow-bg {
	top: 13px;
	right: -7px;
	border-top: 6px solid transparent;
	border-bottom: 6px solid transparent;
	border-left: 7px solid #f0f0f0
}

#pageChat .body .msg-client .file .arrow {
	border-left: 6px solid #fff
}

#pageChat .body .msg-agent .name, #pageChat .body .msg-bot .name {
	margin-bottom: 2px;
	font-size: 12px;
	line-height: 14px;
	color: #b2b2b2
}

#pageChat .body .msg-agent .name .date, #pageChat .body .msg-bot .name .date
	{
	margin-left: 8px
}

#pageChat .body .msg-agent .bubble, #pageChat .body .msg-agent .photo,
	#pageChat .body .msg-bot .bubble, #pageChat .body .msg-bot .photo {
	float: left;
	width: auto;
	max-width: 100%;
	margin-right: 35px
}

#pageChat .body .msg-agent .bubble, #pageChat .body .msg-bot .bubble {
	color: #000;
	background-color: #fff;
	border: 1px solid #f0f0f0
}

#pageChat .body .msg-agent .bubble a, #pageChat .body .msg-bot .bubble a
	{
	color: #000
}

#pageChat .body .msg-agent div.rich-text-bubble, #pageChat .body .msg-bot div.rich-text-bubble
	{
	margin-right: 0;
	padding: 12px
}

#pageChat .body .msg-agent div.rich-text-bubble ol, #pageChat .body .msg-agent div.rich-text-bubble ul,
	#pageChat .body .msg-bot div.rich-text-bubble ol, #pageChat .body .msg-bot div.rich-text-bubble ul
	{
	list-style-position: inside;
	margin: 0;
	padding: 0
}

#pageChat .body .msg-agent div.rich-text-bubble a, #pageChat .body .msg-bot div.rich-text-bubble a
	{
	color: #6088e6;
	text-decoration: none !important
}

#pageChat .body .msg-agent div.rich-text-bubble .rating, #pageChat .body .msg-bot div.rich-text-bubble .rating
	{
	top: 12px !important
}

#pageChat .body .msg-agent div.rich-text-bubble [data-role=new-line],
	#pageChat .body .msg-bot div.rich-text-bubble [data-role=new-line] {
	height: 20px
}

#pageChat .body .msg-agent div.rich-text-bubble div:empty, #pageChat .body .msg-bot div.rich-text-bubble div:empty
	{
	height: 20px
}

#pageChat .body .msg-agent .arrow-bg, #pageChat .body .msg-bot .arrow-bg
	{
	top: 13px;
	left: -7px;
	border-top: 6px solid transparent;
	border-bottom: 6px solid transparent;
	border-right: 7px solid #f0f0f0
}

#pageChat .body .msg-agent .arrow, #pageChat .body .msg-bot .arrow {
	top: 14px;
	left: -6px;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-right: 6px solid #fff
}

#pageChat .body .msg-agent .file, #pageChat .body .msg-bot .file {
	width: auto;
	max-width: 100%;
	margin-right: 35px
}

#pageChat .body .msg-bot .bubble .menu ol {
	list-style: none;
	padding: 0;
	margin: 6px 0
}

#pageChat .body .msg-bot .bubble .menu li {
	display: block;
	overflow: hidden;
	text-overflow: ellipsis
}

#pageChat .body .msg-bot .bubble .menu-item {
	color: #6088e6;
	cursor: pointer
}

#pageChat .body .msg-bot .bubble .menu-tips {
	color: #aaa;
	margin-top: 1em
}

#pageChat .body .msg-bot .rating {
	margin: 0 -12px;
	text-align: center;
	border-top: 1px solid #eee;
	position: relative;
	top: 8px;
	padding: 5px 0;
	min-width: 120px;
	zoom: 1
}

#pageChat .body .msg-bot .rating a {
	color: #009de7;
	width: 50%;
	float: left;
	_display: inline
}

#pageChat .body .msg-bot .rating:after {
	content: '';
	display: block;
	clear: both;
	visibility: hidden
}

#pageChat .body .msg-bot .rating .split {
	position: absolute;
	left: 50%;
	top: 0;
	bottom: 0;
	width: 1px;
	background: #eee
}

#pageChat .body .msg-bot .pending-text, #pageChat .body .msg-bot .rated-text
	{
	display: none;
	color: #aaa
}

#pageChat .body .msg-bot .pending .split, #pageChat .body .msg-bot .pending a,
	#pageChat .body .msg-bot .rated .split, #pageChat .body .msg-bot .rated a,
	#pageChat .footer #blacklistTips.hide, #pageChat .footer #chatHasEnd.hide
	{
	display: none
}

#pageChat .body .msg-bot .pending .pending-text, #pageChat .body .msg-bot .rated .rated-text,
	#pageTicket .body #ticketForm #ticketV2.active {
	display: block
}

#pageChat .body .msg-evaluation, #pageChat .body .msg-redirect {
	width: 100%;
	margin-bottom: 20px;
	color: #999;
	text-align: center;
	font-size: 12px
}

#pageChat .body .msg-redirect>span {
	margin: 0 4px;
	color: #2ac8d1
}

#pageChat .body .msg-evaluation .evaluation-level-0 {
	color: #ff5c5e
}

#pageChat .body .msg-evaluation .evaluation-level-1 {
	color: #ffb652
}

#pageChat .body .msg-evaluation .evaluation-level-2 {
	color: #00ce7d
}

#pageChat .body .msg-evaluation .evaluation-content {
	margin-top: 4px;
	color: #b0b0b0
}

#pageChat .body .msg-blacklist, #pageChat .body .msg-common-tips {
	width: 100%;
	padding-bottom: 10px;
	color: #999;
	text-align: center;
	font-size: 12px
}

#pageChat .body .msg-common-tips a {
	color: #009de7
}

#pageChat .footer {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 130px;
	background-color: #fff;
	box-shadow: 0 -1px 0 0 rgba(0, 0, 0, .04), 0 -2px 0 0 rgba(0, 0, 0, .01)
}

#pageChat .footer #blacklistTips, #pageChat .footer #chatHasEnd {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	width: 100%;
	height: 100px;
	background-color: #fff;
	text-align: center;
	line-height: 100px
}

#pageChat .footer #chatHasEnd>a {
	margin: 0 5px;
	color: #6088e6
}

#pageChat .footer .text-holder {
	height: 60px
}

#pageChat .footer .text-holder #textarea {
	display: block;
	width: 100%;
	height: 60px;
	padding: 8px 10px;
	overflow-x: hidden;
	overflow-y: auto;
	resize: none;
	outline: 0;
	background-color: #fff;
	border: 0;
	word-break: break-all;
	font-size: 13px;
	line-height: 17px;
	-webkit-appearance: none
}

#pageChat .footer .feature-holder {
	height: 40px
}

#pageChat .footer .feature-holder .feature-left:after, #pageChat .footer .feature-holder:after
	{
	display: block;
	content: '';
	clear: both
}

#pageChat .footer .feature-holder .feature-left {
	float: left;
	padding-top: 10px
}

#pageChat .footer .feature-holder .feature-right {
	float: right
}

#pageChat .footer .feature-holder #emojiBtn {
	margin-left: 10px
}

#pageChat .footer .feature-holder .feature-btn {
	float: left;
	display: block;
	margin-left: 5px;
	cursor: pointer
}

#pageChat .footer .feature-holder .icon-emoji {
	background-position: 0 0
}

#pageChat .footer .feature-holder .icon-emoji:active, #pageChat .footer .feature-holder .icon-emoji:hover
	{
	background-position: -22px 0
}

#pageChat .footer .feature-holder .icon-photo {
	background-position: 0 -22px
}

#pageChat .footer .feature-holder .icon-photo:active, #pageChat .footer .feature-holder .icon-photo:hover
	{
	background-position: -22px -22px
}

#pageChat .footer .feature-holder .icon-upload {
	background-position: 0 -440px
}

#pageChat .footer .feature-holder .icon-upload:active, #pageChat .footer .feature-holder .icon-upload:hover
	{
	background-position: -22px -440px
}

#pageChat .footer .feature-holder .icon-evaluation {
	background-position: 0 -44px
}

#pageChat .footer .feature-holder .icon-evaluation:active, #pageChat .footer .feature-holder .icon-evaluation:hover
	{
	background-position: -22px -44px
}

#pageChat .footer .feature-holder #photoFile, #pageChat .footer .feature-holder #uploadFile
	{
	position: absolute;
	right: 0;
	top: 0;
	visibility: hidden
}

#pageChat .footer .feature-holder #btnSend {
	display: block;
	padding: 0;
	margin-top: 4px;
	margin-right: 10px;
	width: 60px;
	height: 30px;
	font-size: 13px;
	border: 0;
	outline: none;
	background-color: #f7f7f7;
	border-radius: 3px;
	color: #cfcfcf;
	cursor: pointer;
	text-align: center
}

#pageChat .footer .support-holder {
	height: 30px;
	background-color: #f4f4f4;
	border-top: 1px solid #ededed
}

#pageCall .footer .support-holder>a, #pageChat .footer .support-holder>a,
	#pageTicket .footer .support-holder>a {
	display: block;
	height: 30px;
	text-align: center;
	line-height: 30px;
	font-size: 12px;
	color: #b7bac2
}

#pageCall .footer .support-holder>a>span, #pageChat .footer .support-holder>a>span,
	#pageSurvey .footer .support-holder>a>span, #pageTicket .footer .support-holder>a>span
	{
	vertical-align: super
}

#pageChat .footer #emojiHolder {
	position: absolute;
	display: none;
	top: -121px;
	left: 0;
	right: 0;
	z-index: 2;
	width: 100%;
	height: 120px;
	background-color: rgba(255, 255, 255, .96);
	border-top: 1px solid #ddd
}

#pageChat .footer #emojiHolder .emoji-control {
	display: block;
	float: left;
	width: 25px;
	height: 25px;
	margin: 10px 0 0 10px;
	cursor: pointer
}

#pageChat .footer #emojiHolder .emoji-smile {
	background-position: 0 0
}

#pageChat .footer #emojiHolder .emoji-laughing {
	background-position: 0 -25px
}

#pageChat .footer #emojiHolder .emoji-blush {
	background-position: 0 -50px
}

#pageChat .footer #emojiHolder .emoji-heart_eyes {
	background-position: 0 -75px
}

#pageChat .footer #emojiHolder .emoji-smirk {
	background-position: 0 -100px
}

#pageChat .footer #emojiHolder .emoji-flushed {
	background-position: 0 -125px
}

#pageChat .footer #emojiHolder .emoji-grin {
	background-position: 0 -150px
}

#pageChat .footer #emojiHolder .emoji-kissing_smiling_eyes {
	background-position: 0 -175px
}

#pageChat .footer #emojiHolder .emoji-wink {
	background-position: 0 -200px
}

#pageChat .footer #emojiHolder .emoji-kissing_closed_eyes {
	background-position: 0 -225px
}

#pageChat .footer #emojiHolder .emoji-stuck_out_tongue_winking_eye {
	background-position: 0 -250px
}

#pageChat .footer #emojiHolder .emoji-sleeping {
	background-position: 0 -275px
}

#pageChat .footer #emojiHolder .emoji-worried {
	background-position: 0 -300px
}

#pageChat .footer #emojiHolder .emoji-sweat_smile {
	background-position: 0 -325px
}

#pageChat .footer #emojiHolder .emoji-cold_sweat {
	background-position: 0 -350px
}

#pageChat .footer #emojiHolder .emoji-joy {
	background-position: 0 -375px
}

#pageChat .footer #emojiHolder .emoji-sob {
	background-position: 0 -400px
}

#pageChat .footer #emojiHolder .emoji-angry {
	background-position: 0 -425px
}

#pageChat .footer #emojiHolder .emoji-mask {
	background-position: 0 -450px
}

#pageChat .footer #emojiHolder .emoji-scream {
	background-position: 0 -475px
}

#pageChat .footer #emojiHolder .emoji-sunglasses {
	background-position: 0 -500px
}

#pageChat .footer #emojiHolder .emoji-thumbsup {
	background-position: 0 -525px
}

#pageChat .footer #emojiHolder .emoji-clap {
	background-position: 0 -550px
}

#pageChat .footer #emojiHolder .emoji-ok_hand {
	background-position: 0 -575px
}

#pageChat #unableService.hide, #pageChat .audio-holder {
	display: none
}

#pageChat #unableService {
	top: 60px;
	bottom: 30px;
	background-color: #fff;
	text-align: center
}

#pageChat #unableService>img {
	display: block;
	width: 64px;
	height: 50px;
	margin: 80px auto 0
}

#pageChat #unableService>div {
	margin-top: 20px;
	color: #979797
}

#pageChat #unableService .btn-go-ticket {
	display: block;
	width: 210px;
	height: 35px;
	margin: 20px auto 0;
	line-height: 35px;
	border-radius: 4px
}

#pageChat #queueingTips, #pageChat #unableService, #pageTicket .header {
	position: absolute;
	left: 0;
	right: 0;
	z-index: 3;
	width: 100%
}

#pageChat #queueingTips {
	bottom: 30px;
	background-color: #fff;
	font-size: 12px;
	overflow-x: hidden;
	overflow-y: auto;
	top: 60px
}

#pageChat #queueingTips.hide {
	display: none
}

#pageChat #queueingTips .queue-header {
	width: 270px;
	margin: 15px auto 0;
	line-height: 22px;
	color: #666
}

#pageChat #queueingTips .queue-body {
	position: relative;
	width: 100%;
	height: 160px;
	margin-top: 30px;
	background-color: #fefefe;
	box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, .04), inset 0 1px 0 0
		rgba(0, 0, 0, .04);
	text-align: center
}

#pageChat #queueingTips .queue-body .queue-position-title {
	padding-top: 32px
}

@
-webkit-keyframes jump { 0%{
	-webkit-transform: translateY(0);
	transform: translateY(0);
	text-shadow: 0 30px 36px
}

to {
	-webkit-transform: translateY(-6px);
	transform: translateY(-6px);
	text-shadow: 0 40px 40px
}

}
@
keyframes jump { 0%{
	-webkit-transform: translateY(0);
	transform: translateY(0);
	text-shadow: 0 30px 36px
}

to {
	-webkit-transform: translateY(-6px);
	transform: translateY(-6px);
	text-shadow: 0 40px 40px
}

}
#pageChat #queueingTips .queue-body #queueingPosition {
	position: absolute;
	top: 48px;
	left: 50%;
	width: 40px;
	margin-left: -20px;
	font-size: 48px;
	text-shadow: 0 30px 36px;
	-webkit-animation: jump .3s ease-in-out infinite alternate;
	animation: jump .3s ease-in-out infinite alternate
}

#pageChat #queueingTips .queue-footer {
	margin-top: 50px;
	text-align: center
}

#pageChat #queueingTips .queue-footer>p {
	margin: 0;
	color: #666
}

#pageChat #queueingTips .queue-footer .btn-go-ticket {
	display: block;
	width: 268px;
	height: 36px;
	margin: 12px auto;
	line-height: 36px;
	border-radius: 3px;
	font-size: 13px
}

#pageCall, #pageSurvey, #pageTicket {
	display: none;
	position: relative;
	z-index: 2;
	width: 100%;
	height: 100%;
	overflow: hidden
}

#pageTicket.remove-brand .body {
	bottom: 0
}

#pageTicket.remove-brand .footer {
	display: none
}

#pageTicket .header {
	top: 0;
	height: 60px;
	padding: 7px 10px;
	zoom: 1;
	box-shadow: 0 1px 0 0 rgba(0, 0, 0, .06), 0 2px 0 0 rgba(0, 0, 0, .01)
}

#pageTicket .header .title {
	margin-top: 13px;
	margin-left: 6px;
	font-size: 14px
}

#pageTicket .header #btnHideTicket {
	float: left
}

#pageTicket .header .icon-angel-down {
	display: block;
	width: 22px;
	height: 22px
}

#pageTicket .body {
	top: 60px;
	bottom: 30px;
	background-color: #fff
}

#pageTicket .body #ticketForm {
	width: 100%;
	height: 100%;
	overflow-y: auto;
	overflow-x: hidden;
	background-color: #f2f3f5
}

#pageTicket .body #ticketForm #ticketV2, #pageTicket .body #ticketSuccess
	{
	display: none;
	width: 100%;
	height: 100%;
	overflow-y: auto;
	overflow-x: hidden
}

#pageTicket .body #ticketForm .step-title {
	margin: 16px;
	font-size: 12px;
	color: #666;
	word-break: break-all;
	line-height: 1.8
}

#pageSurvey .body .captcha-group .group-title, #pageSurvey .body .form-group .group-title,
	#pageTicket .body #ticketForm .captcha-group .group-title, #pageTicket .body #ticketForm .form-group .group-title
	{
	margin: 16px 0 6px 16px;
	color: #444;
	font-size: 12px
}

#pageSurvey .body .captcha-group .group-title>span, #pageSurvey .body .form-group .group-title>span,
	#pageTicket .body #ticketForm .captcha-group .group-title>span,
	#pageTicket .body #ticketForm .form-group .group-title>span {
	margin-left: 4px;
	color: #ff5c5e
}

#pageSurvey .body .captcha-group .group-content, #pageSurvey .body .form-group .group-content,
	#pageTicket .body #ticketForm .captcha-group .group-content,
	#pageTicket .body #ticketForm .form-group .group-content {
	background-color: #fff;
	box-shadow: 0 1px 0 0 rgba(0, 0, 0, .04), 0 -1px 0 0 rgba(0, 0, 0, .04)
}

#pageSurvey .body .captcha-group .group-content input[type=text],
	#pageSurvey .body .form-group .group-content input[type=text],
	#pageTicket .body #ticketForm .captcha-group .group-content input[type=text],
	#pageTicket .body #ticketForm .form-group .group-content input[type=text]
	{
	width: 100%;
	height: auto;
	padding: 12px;
	border: none
}

#pageTicket .body #ticketForm .captcha-group .group-content textarea,
	#pageTicket .body #ticketForm .form-group .group-content textarea {
	display: block;
	width: 100%;
	height: 90px;
	padding: 12px 16px;
	overflow-x: hidden;
	overflow-y: auto;
	resize: none;
	outline: 0;
	background-color: #fff;
	border: none;
	word-break: break-all;
	font-size: 12px;
	-webkit-appearance: none
}

#pageSurvey .body .captcha-group .group-content .choice-item,
	#pageSurvey .body .form-group .group-content .choice-item, #pageTicket .body #ticketForm .captcha-group .group-content .choice-item,
	#pageTicket .body #ticketForm .form-group .group-content .choice-item {
	box-shadow: 0 -1px 0 0 rgba(0, 0, 0, .04)
}

#pageSurvey .body .captcha-group .group-content .choice-item>label,
	#pageSurvey .body .form-group .group-content .choice-item>label,
	#pageTicket .body #ticketForm .captcha-group .group-content .choice-item>label,
	#pageTicket .body #ticketForm .form-group .group-content .choice-item>label
	{
	display: block;
	padding: 11px 16px;
	cursor: pointer
}

#pageSurvey .body .captcha-group .group-content, #pageTicket .body #ticketForm .captcha-group .group-content
	{
	position: relative
}

#pageSurvey .body .captcha-group .captcha-input, #pageTicket .body #ticketForm .captcha-group .captcha-input
	{
	margin-right: 74px
}

#pageSurvey .body .captcha-group .captcha-img, #pageTicket .body #ticketForm .captcha-group .captcha-img
	{
	position: absolute;
	top: 0;
	right: 0;
	width: 74px;
	height: 39px
}

#pageSurvey .body .captcha-group .captcha-img>img, #pageTicket .body #ticketForm .captcha-group .captcha-img>img
	{
	width: 74px;
	height: 39px;
	border: 0;
	cursor: pointer
}

#pageTicket .body #ticketForm .btn-group {
	width: 100%;
	margin: 24px 0;
	padding: 0 16px
}

#pageTicket .body #ticketForm .btn-group #ticketSubmit {
	display: block;
	width: 100%;
	height: 44px;
	border-radius: 5px;
	line-height: 44px;
	text-align: center;
	font-size: 15px
}

#pageTicket .body #ticketSuccess {
	padding: 15px;
	text-align: center
}

#pageTicket .body #ticketSuccess #ticketDone {
	display: block;
	width: 160px;
	height: 32px;
	line-height: 32px;
	border-radius: 3px;
	margin: 20px auto
}

#pageTicket .body #ticketSuccess #ticketAgain {
	display: block;
	text-decoration: underline;
	font-size: 12px
}

#pageCall .header, #pageTicket .body, #pageTicket .footer {
	position: absolute;
	left: 0;
	right: 0;
	width: 100%
}

#pageTicket .footer {
	bottom: 0;
	height: 30px
}

#pageTicket .footer .support-holder {
	height: 30px;
	background-color: #f4f4f4;
	border-top: 1px solid #ededed
}

#pageCall.remove-brand .body {
	bottom: 0
}

#pageCall .body #callForm .captcha-group.hide, #pageCall.remove-brand .footer
	{
	display: none
}

#pageCall .header {
	top: 0;
	z-index: 3;
	height: 60px;
	padding: 7px 10px;
	zoom: 1;
	box-shadow: 0 1px 0 0 rgba(0, 0, 0, .06), 0 2px 0 0 rgba(0, 0, 0, .01)
}

#pageCall .header .title {
	margin-top: 13px;
	font-size: 14px
}

#pageCall .header #btnHideTicket {
	float: left
}

#pageCall .header .icon-angel-down {
	display: block;
	width: 22px;
	height: 22px
}

#pageCall .body, #pageCall .body #callForm {
	width: 100%;
	overflow-y: auto;
	overflow-x: hidden
}

#pageCall .body {
	position: absolute;
	top: 60px;
	right: 0;
	bottom: 30px;
	left: 0;
	background-color: #fff
}

#pageCall .body #callForm {
	height: 100%;
	padding: 15px
}

#pageCall .body #callForm .intro {
	margin-top: 10px;
	font-size: 13px;
	color: #555;
	text-align: center
}

#pageCall .body #callForm .captcha-input>input, #pageCall .body #callForm .input-group>input
	{
	width: 100%;
	height: auto;
	padding: 12px;
	border: 0;
	color: #000;
	background-color: #fff;
	font-size: 14px;
	letter-spacing: 16px
}

#pageCall .body #callForm .captcha-input>input::-webkit-input-placeholder,
	#pageCall .body #callForm .input-group>input::-webkit-input-placeholder
	{
	letter-spacing: normal;
	color: #555
}

#pageCall .body #callForm .captcha-input>input:-moz-placeholder,
	#pageCall .body #callForm .captcha-input>input::-moz-placeholder,
	#pageCall .body #callForm .input-group>input:-moz-placeholder,
	#pageCall .body #callForm .input-group>input::-moz-placeholder {
	letter-spacing: normal;
	color: #555
}

#pageCall .body #callForm .captcha-input>input:-ms-input-placeholder,
	#pageCall .body #callForm .input-group>input:-ms-input-placeholder {
	letter-spacing: normal;
	color: #555
}

#pageCall .body #callForm .captcha-group, #pageCall .body #callForm .input-group
	{
	margin-top: 24px;
	border-bottom: 1px solid #555
}

#pageCall .body #callForm .captcha-group {
	position: relative;
	padding-right: 70px
}

#pageCall .body #callForm .captcha-group .captcha-input {
	width: 100%
}

#pageCall .body #callForm .captcha-group .captcha-img {
	position: absolute;
	top: 0;
	right: 0;
	width: 60px;
	height: 40px
}

#pageCall .body #callForm .captcha-group .captcha-img>img {
	width: 60px;
	height: 40px;
	border: 0;
	cursor: pointer
}

#pageCall .body #callForm .submit-group {
	margin-top: 36px
}

#pageCall .body #callForm .submit-group #submitCall, #pageCall .body #callSuccess .call-success-icon
	{
	position: relative;
	width: 60px;
	height: 60px;
	box-shadow: 0 3px 5px 0 rgba(0, 0, 0, .1), inset 0 0 0 1px
		rgba(0, 0, 0, .01);
	border-radius: 30px
}

#pageCall .body #callForm .submit-group #submitCall {
	display: block;
	background-color: #c8c8c8;
	margin: 0 auto
}

#pageCall .body #callForm .submit-group .submit-intro {
	margin-top: 16px;
	font-size: 13px;
	text-align: center
}

#pageCall .body #callSuccess {
	display: none;
	width: 100%;
	height: 100%;
	padding: 15px;
	overflow-y: auto;
	overflow-x: hidden
}

#pageCall .body #callSuccess .call-success-icon {
	margin: 100px auto 24px
}

#pageCall .body #callForm .submit-group #submitCall .icon-submit-tel,
	#pageCall .body #callSuccess .call-success-icon .icon-submit-tel {
	display: block;
	position: absolute;
	top: 19px;
	left: 19px;
	width: 22px;
	height: 22px;
	background-position: 0 -572px
}

#pageCall .body #callSuccess>p {
	margin: 0 0 8px;
	text-align: center;
	font-size: 12px;
	color: #999
}

#pageCall .footer {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 30px
}

#pageCall .footer .support-holder {
	height: 30px;
	background-color: #f4f4f4;
	border-top: 1px solid #ededed
}

#pageSurvey.remove-brand .body {
	bottom: 0
}

#pageSurvey.remove-brand .footer {
	display: none
}

#pageSurvey .header {
	top: 0;
	z-index: 3;
	height: 60px;
	padding: 7px 10px;
	zoom: 1;
	box-shadow: 0 1px 0 0 rgba(0, 0, 0, .06), 0 2px 0 0 rgba(0, 0, 0, .01)
}

#pageSurvey .header .title {
	margin-top: 13px;
	font-size: 14px
}

#pageSurvey .header #btnHideSurvey {
	float: left
}

#pageSurvey .header .icon-angel-down {
	display: block;
	width: 22px;
	height: 22px
}

#pageSurvey .body, #pageSurvey .footer, #pageSurvey .header {
	position: absolute;
	left: 0;
	right: 0;
	width: 100%
}

#pageSurvey .body {
	top: 60px;
	overflow-x: hidden;
	overflow-y: auto;
	bottom: 30px;
	background-color: #f2f3f5
}

#pageSurvey .body #surveyStep1, #pageSurvey .body #surveyStep2 {
	display: none;
	width: 100%;
	height: 100%;
	overflow-y: auto;
	overflow-x: hidden
}

#pageSurvey .body #surveyStep1.active, #pageSurvey .body #surveyStep2.active
	{
	display: block
}

#pageSurvey .body .step-title {
	margin: 16px;
	font-size: 12px;
	color: #666;
	word-break: break-all;
	line-height: 1.8
}

#pageSurvey .body .menus-item {
	padding: 14px;
	background-color: #fff;
	box-shadow: 0 -1px 0 0 rgba(0, 0, 0, .04)
}

#pageSurvey .body .menus-item>a {
	display: block;
	font-size: 13px;
	word-break: break-all;
	color: #007aff
}

#pageSurvey .body .btn-group {
	width: 100%;
	margin: 24px 0;
	padding: 0 16px
}

#pageSurvey .body .btn-group #surveySubmit {
	display: block;
	width: 100%;
	height: 44px;
	border-radius: 5px;
	line-height: 44px;
	text-align: center;
	font-size: 15px
}

#pageSurvey .footer {
	bottom: 0;
	height: 30px;
	background-color: #fff
}

#pageSurvey .footer .support-holder {
	height: 30px;
	background-color: #f9f9f9;
	border-top: 1px solid #ededed
}

#pageSurvey .footer .support-holder>a {
	display: block;
	height: 30px;
	font-size: 12px;
	color: #b7bac2;
	text-align: center;
	line-height: 30px
}